#include("/template/common/layout/_page_layout_all.html")
#@layout()

#define css()
<style>

</style>
#end

#define js()
<script type="text/javascript">
    layui.use(['form', 'layer', 'laydate', 'upload','element'], function () {
        var layer = layui.layer
            , $ = layui.jquery
            , form = layui.form
            , element = layui.element
            , laydate = layui.laydate
            , upload = layui.upload;
        laydate.render({
            elem: document.getElementById('expertGroup.worktime')
            , max: 0
        });
        laydate.render({
            elem: document.getElementById('expertGroup.birthday')
        });

        //创建监听函数
         var xhrOnProgress=function(fun) {
            xhrOnProgress.onprogress = fun; //绑定监听
             //使用闭包实现监听绑
            return function() {
                //通过$.ajaxSettings.xhr();获得XMLHttpRequest对象
                var xhr = $.ajaxSettings.xhr();
                 //判断监听函数是否为函数
                  if (typeof xhrOnProgress.onprogress !== 'function')
                       return xhr;
                   //如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去
                    if (xhrOnProgress.onprogress && xhr.upload) {
                          xhr.upload.onprogress = xhrOnProgress.onprogress;
                    }
                    return xhr;
             }
         }

        var file1 = "";
        var file2 = "";
        form.on('submit(sub)', function (data) {
            $('#uploadBtn1').click();
            if (file1 == "") {
                layer.msg("工作证件照片未上传或上传失败，请重新选择上传！");
                return false;
            }
            if (file2 == "") {
                layer.msg("专业资格证书未上传或上传失败，请重新选择上传！");
                return false;
            }

            data.field['expertGroup.workpictrue'] = file1;
            data.field['expertGroup.certificate'] = file2;
            var bg = $('<div class="loading-bg"><i class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop loading-ico"></i></div>');
            $('body').prepend(bg);
            $.post("#(ctxPath)/app/person/expertGroupVerify", $.param(data.field), function (res) {
                $('.loading-bg').remove();
                layer.msg(res.msg);
                if (res.code === '0') {
                    setTimeout(function () {
                        window.parent.window.refresh();
                    }, 1000);
                }
            });
            return false;

        });

        var workpictrue = '#(expertGroup.workpictrue)';
        var certificate = '#(expertGroup.certificate)';
        $('#see1').click(function () {
            if (workpictrue == null || workpictrue === "") {
                layer.msg("对不起，您当前没有上传工作证件照片！");
            } else {
                pop_show('查看文件', '#(ctxPath)/util/pdfView?fileID=' + workpictrue, '', '', function () {
                });
            }
        });
        $('#see2').click(function () {
            if (certificate == null || certificate === "") {
                layer.msg("对不起，您当前没有上传专业资格证书！");
            } else {
                pop_show('查看文件', '#(ctxPath)/util/pdfView?fileID=' + certificate, '', '', function () {
                });
            }
        });


        $(function () {
            var test = "#(expertGroup.nation)";
            if (test.length > 0) {
                $("input").prop("disabled", "disabled").addClass("layui-disabled");
                $("textarea").prop("disabled", "disabled").addClass("layui-disabled");
                $("select").prop("disabled", "disabled").addClass("layui-disabled");
                $(".layui-select-title").unbind();
                $("option").prop("disabled", "disabled").addClass("layui-disabled");
                $("#sub").hide();
            }
            $.fn.serializeJson = function () {
                var serializeObj = {};
                $(this.serializeArray()).each(function () {
                    serializeObj[this.name] = this.value;
                });
                return serializeObj;
            };
            if (workpictrue != null && workpictrue !== "") {
                file1 = workpictrue;
            }
            if (certificate != null && certificate !== "") {
                file2 = certificate;
            }
        });

        $('#back').click(function () {
            window.parent.window.refresh();
        });

        upload.render({
            elem: '#upload1'
            , url: '#(ctxPath)/util/uploadFile'
            , accept: 'file'
            , exts: 'pdf|png|jpeg|jpg'
            , data: {
                description: "工作证件照片"
            }
            ,xhr:xhrOnProgress
            ,progress:function(value){//上传进度回调 value进度值
                element.progress('upload-progress', value+'%')//设置页面进度条
            }
            , before: function (res) {
                $('#upload-progress').removeClass('layui-hide');
            }, done: function (res) {
                <!--$('.loading-bg').remove();-->
                $('#upload-progress').addClass('layui-hide');
                if (res.code == 0) {
                    layer.msg("工作证件照片上传成功");
                    file1 = res.data.fileId;
                    workpictrue = res.data.fileId;
                    $('#upload1').text('上传成功');
                    // $('#upload1').addClass("layui-disabled").prop("disabled", "disabled");
                } else if (res.code == 1) {
                    layer.msg("工作证件照片文件上传错误，请重新选择上传！");
                }
            }
            , error: function (index, upload) {
                $('#upload-progress').addClass('layui-hide');
                alert("工作证件照片文件上传错误！请重新尝试！");
            }
        });

        upload.render({
            elem: '#upload2'
            , url: '#(ctxPath)/util/uploadFile'
            , accept: 'file'
            //,multiple: true
            , exts: 'pdf|png|jpeg|jpg'
            , data: {
                description: "专业资格证书"
            }
            ,xhr:xhrOnProgress
            ,progress:function(value){//上传进度回调 value进度值
                element.progress('upload-progress2', value+'%')//设置页面进度条
            }
            , before: function (res) {
                $('#upload-progress2').removeClass('layui-hide');
            }, done: function (res) {
                $('#upload-progress').addClass('layui-hide');
                if (res.code == 0) {
                    <!--$('.loading-bg').remove();-->
                    layer.msg("专业资格证书上传成功");
                    file2 = res.data.fileId;
                    certificate = res.data.fileId;
                    $('#upload2').text('上传成功');
                    // $('#upload2').addClass("layui-disabled").prop("disabled", "disabled");
                } else if (res.code == 1) {
                    layer.msg("专业资格证书文件上传失败，请重新选择上传！");
                }
            }
            , error: function (index, upload) {
                $('#upload-progress2').addClass('layui-hide');
                alert("专业资格证书文件上传错误！请重新尝试！");
            }
        });


        var flag = "#(flag)";
        var auth = "#(auth)";
        if (flag === "true") {
            if (auth === "true") {
                $('#sub').remove();
                $('#upload1').addClass("layui-hide layui-disabled").prop("disabled", "disabled");
                $('#upload2').addClass("layui-hide layui-disabled").prop("disabled", "disabled");
                $('input').attr("disabled", "disabled").addClass("layui-disabled");
                $('textarea').attr("disabled", "disabled").addClass("layui-disabled");
                $('.layui-select-title').removeClass('layui-select-title')
            }
        }
    });


</script>
#end

#define content()
<div class="layui-fluid">

    <fieldset class="layui-elem-field layui-field-title" style="margin-top:30px;color: #009688;">
        <legend style="font-size: 20px;font-weight: 500;">申请成为专家</legend>
    </fieldset>

    <form class="layui-form layui-form-pane" action="" id="content" method="post">

        <div class="layui-form-item">
            <label class="layui-form-label" for="expertGroup.name" style="width: 180px">专家名称</label>
            <div class="layui-input-block">
                <input type="text" name="expertGroup.name" id="expertGroup.name" required lay-verify="required"
                       value="#(person.name)" class="layui-input layui-disabled"
                       placeholder="请输入专家名称" autocomplete="off" style="width: 210px" disabled>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label" for="expertGroup.workstate" style="width: 180px">
                <em class="require-mark">*</em>在职状态</label>
            <div class="layui-input-inline" style="width: 210px">
                <select name="expertGroup.workstate" id="expertGroup.workstate" lay-verify="required">
                    <option value="">请选择</option>
                    #if(expertGroup.wokstate == 0)
                    <option value="在职">在职</option>
                    <option value="离职" selected="">离职</option>
                    #else
                    <option value="在职" selected="">在职</option>
                    <option value="离职">离职</option>
                    #end
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label" for="expertGroup.worktime" style="width: 180px">
                <em class="require-mark">*</em>工作时间
            </label>
            <div class="layui-input-block">
                <input type="text" name="expertGroup.worktime" id="expertGroup.worktime" autocomplete="off"
                       value="#(expertGroup.worktime)" class="layui-input" lay-verify="required" style="width: 210px">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" for="expertGroup.department" style="width: 180px">
                <em class="require-mark">*</em>部门名称
            </label>
            <div class="layui-input-block">
                <input type="text" name="expertGroup.department" id="expertGroup.department" autocomplete="off"
                       value="#(expertGroup.department)" class="layui-input" lay-verify="required" style="width: 210px">
            </div>
        </div>

        <div class="layui-progress layui-hide" style="margin-bottom:10px" lay-showpercent="true" id="upload-progress" lay-filter="upload-progress" >
            <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" for="upload1" style="width: 180px">
                <em class="require-mark">*</em>工作证件照片
            </label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" name="upload1" id="upload1">
                            <i class="layui-icon"></i>上传文件
                        </button>
                        <button type="button" class="layui-hide" id="uploadBtn1"></button>
                        <button type="button" class="layui-btn" id="see1">浏览</button>
                    </div>
                </div>
            </div>
        </div>


        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label" for="expertGroup.profess">
                <p style="margin: 0 30px">
                    <em class="require-mark">*</em>专业资格内容
                </p>
            </label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" name="expertGroup.profess" id="expertGroup.profess"
                          class="layui-textarea">#(expertGroup.profess)</textarea>
            </div>
        </div>

        <div class="layui-progress layui-hide" style="margin-bottom:10px" lay-showpercent="true" id="upload-progress2" lay-filter="upload-progress2" >
            <div class="layui-progress-bar layui-bg-green" lay-percent="0%"></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" for="upload2" style="width: 180px">
                <em class="require-mark">*</em>专业资格证书
            </label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" name="upload2" id="upload2">
                            <i class="layui-icon"></i>上传文件
                        </button>
                        <button type="button" class="layui-hide" id="uploadBtn2"></button>
                        <button type="button" class="layui-btn" id="see2">浏览</button>
                    </div>
                </div>
            </div>
        </div>


        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label" for="expertGroup.project">
                <p style="margin: 0 30px">
                    <em class="require-mark">*</em>参与项目经历
                </p>
            </label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" name="expertGroup.project" id="expertGroup.project"
                          class="layui-textarea">#(expertGroup.project)</textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <button type="button" class="layui-btn" lay-filter="sub" lay-submit id="sub">
                保存
            </button>
            <button type="button" class="layui-btn" id="back">
                返回
            </button>
        </div>
    </form>
    <hr>
</div>

#end